<template>
<!--  问诊单管理-->
  <div>
    <!-- 模糊搜索 -->
    <el-card class="box-card" style="height: 70px">
      <el-form :inline="true" :model="searchForm" ref="searchForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="患者姓名" prop="patientName">
          <el-input size="small" type="text" v-model="searchForm.patientName" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="问诊编号" prop="consultationNum">
          <el-input size="small" type="text" v-model="searchForm.consultationId" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="search">搜索</el-button>
          <el-button @click="resetForm('searchForm')">重置</el-button>
          <el-button type="primary" @click="openListDialog">问诊评价</el-button>
          <el-button type="success" @click="openUnitDialog">添加</el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!-- 对话框区域 -->
    <el-dialog :title="title" top="30px" width="33%" :visible.sync="dialogVisible" :close-on-click-modal="false">
      <el-form :model="unitMeasure" label-width="150px">
        <el-form-item label="患者姓名">
          <el-input v-model="unitMeasure.patientName" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="问诊编号">
          <el-input v-model="unitMeasure.consultationId" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="电话号码">
          <el-input v-model="unitMeasure.phoneNumber" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="科室">
          <el-input v-model="unitMeasure.department" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="医生">
          <el-select v-model="unitMeasure.doctorName" placeholder="请选择医生">
            <el-option v-for="doctor in dList" :value="doctor.doctorName"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="问诊费">
          <el-input v-model="unitMeasure.consultationFee" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="问诊方式">
          <el-input v-model="unitMeasure.consultationMethod" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="问诊来源">
          <el-input v-model="unitMeasure.consultationSource" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="问诊状态">
          <el-input v-model="unitMeasure.orderStatus" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="问诊时间">
          <el-input  type="date" v-model="unitMeasure.submissionTime" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="editUnitMeasure">确 定</el-button>
      </div>
    </el-dialog>

    <!--        列表弹框-->
    <el-dialog width="70%" :visible.sync="listVisible" :close-on-click-modal="false">
      <el-table
        :data="list"
        @selection-change="handleSelectionChange"
        style="width: 100%">
        <el-table-column
          prop="consultationId"
          label="问诊编号">
        </el-table-column>
        <el-table-column
          prop="patientName"
          label="患者姓名">
        </el-table-column>
        <el-table-column
          prop="doctorName"
          label="医生">
        </el-table-column>
        <el-table-column
          prop="submissionTime"
          label="问诊时间">
        </el-table-column>
        <el-table-column
          prop="patientFeedback"
          label="患者反馈">
        </el-table-column>
        <el-table-column
          prop="rating"
          label="评分">
        </el-table-column>
      </el-table>
    </el-dialog>

    <!--表格区域-->
    <el-card class="box-card">
      <el-table
        :data="unitList"
        @selection-change="handleSelectionChange"
        style="width: 100%">
        <!--        复选框,默认会有事件handleSelectionChange-->
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          type="index"
          label="序号"
          width="50">
          <template slot-scope="scope">
            {{ (pageNum - 1) * pageSize + scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column
          prop="consultationId"
          label="问诊编号">
        </el-table-column>
        <el-table-column
          prop="patientName"
          label="患者姓名">
        </el-table-column>
        <el-table-column
          prop="phoneNumber"
          label="电话号码">
        </el-table-column>
        <el-table-column
          prop="department"
          label="科室">
        </el-table-column>
        <el-table-column
          prop="doctorName"
          label="医生">
        </el-table-column>
        <el-table-column
          prop="consultationFee"
          label="问诊费">
        </el-table-column>
        <el-table-column
          prop="consultationMethod"
          label="问诊方式">
        </el-table-column>
        <el-table-column
          prop="consultationSource"
          label="问诊来源">
        </el-table-column>
        <el-table-column
          prop="orderStatus"
          label="问诊状态">
          <template slot-scope="scope">
            <el-tag
              :type="scope.row.orderStatus == '1' ? 'primary' : 'success'"
              disable-transitions>{{ scope.row.orderStatus == '1' ? '问诊中' : '待问诊'}}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column
          prop="submissionTime"
          label="问诊时间">
        </el-table-column>
<!--        <el-table-column-->
<!--          prop="consultation_method"-->
<!--          label="问诊方式">-->
<!--          <template slot-scope="scope">-->
<!--            <el-tag-->
<!--              :type="scope.row.sex == '1' ? 'primary' : 'success'"-->
<!--              disable-transitions>{{ scope.row.sex == '1' ? '男' : '女' }}-->
<!--            </el-tag>-->
<!--          </template>-->
<!--        </el-table-column>-->
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button
              size="mini"
              @click="update(scope.row)"
            icon="el-icon-circle-plus-outline">
            </el-button>
            <el-button
              size="mini"
              type="danger"
              @click="delUnit(scope.row)" icon="el-icon-circle-close">
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNum"
        :page-sizes="[2, 3, 4, 5]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </el-card>
  </div>
</template>
<script>
import { getList, delone, re, add, edit, doctorList } from '@/api/consultation/table'
export default {
  name: "unit",
  data() {
    return {
      list: [],
      unitList: [],
      searchForm: {
        patientName: "", // 患者姓名
        consultationId: ""// 问诊编号
      },
      pageNum: 1,
      pageSize: 4,
      total: 0,
      dialogVisible: false,
      listVisible: false,
      title: "添加问诊单",
      unitMeasure: {
        doctorId: "",
        patientName: "",// 患者姓名
        consultationId: "",// 问诊编号
        phoneNumber: "",// 电话号码
        department: "",// 科室
        doctorName: "",// 医生性命
        consultationFee: "",// 问诊费
        consultationMethod: "",// 问诊方式
        consultationSource: "",// 问诊来源
        orderStatus: "",// 问诊状态
        submissionTime: "",// 问诊时间
      },
      rfForm:{
        consultationId: "",// 问诊编号
        patientName: "",// 患者姓名
        doctorName: "",// 医生姓名
        submissionTime: "",// 问诊时间
        patientFeedback: "",// 患者反馈
        rating: "",// 评分
      },
      dList: [],
      multipleSelection: [],
    };
  },

  methods: {
    // 获取单位列表
    getUnitList() {
      getList({
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        patientName: this.searchForm.patientName,
        consultationId: this.searchForm.consultationId,
      }).then(res => {
        // console.log("获取单位列表成功", res)
        // res.data取出的是pageinfo对象，里面包含list和total属性
        this.unitList = res.data.list;
        this.total = res.data.total;
      });
    },

    // 打开添加单位对话框
    openUnitDialog() {
      this.title = "添加问诊单";
      this.unitMeasure = {};
      this.dialogVisible = true;
      this.doctorList();
    },

    // 列表对话框
    openListDialog() {
      this.listVisible = true;
      re({
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        patientName: this.searchForm.patientName,
        consultationId: this.searchForm.consultationId,
      }).then(res => {
        this.list = res.data.list;
        this.total = res.data.total;
      })
    },

    // 点击编辑更改编辑title
    update(row) {
      this.title = "编辑问诊单";
      this.unitMeasure = row;
      this.dialogVisible = true;
      this.doctorList();
    },

    // 添加单位
    editUnitMeasure() {
      if (this.title === "添加问诊单") {
        // 执行添加
        add(this.unitMeasure).then((res) => {
          this.$message.success("添加成功")
        }).catch((error) => {
          console.log("添加失败", error)
        })
      }else {
        // 执行更新
        this.updateUnitMeasure();
      }
      this.dialogVisible = false;
      this.getUnitList();
    },

    // 执行更新
    updateUnitMeasure() {
      console.log("执行更新", this.unitMeasure)
      edit(this.unitMeasure).then((res) => {
        this.$message.success("更新成功")
      }).catch((error) => {
        console.log("更新失败", error)
      })
      this.dialogVisible = false;
      this.getUnitList();
    },

    // 删除单位
    delUnit(row) {
      // console.log(row.measureId);
      this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // console.log(row.measureId)
        delone({ id:row.consultationId }).then(() => {
          this.PageNum = 1;
          this.search()
        }).catch((error) => {
          // this.$message.error('删除执行异常！' + error);
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      })
    },
    // 获取医生列表
    doctorList() {
      doctorList().then(res => {
        this.dList = res.data;
        // console.log("获取医生列表成功", res.data)
      })
    },

    // 处理分页
    handleSizeChange(size) {
      this.pageSize = size;
      this.getUnitList();
    },
    handleCurrentChange(currentPage) {
      this.pageNum = currentPage;
      this.getUnitList();
    },

    // 处理复选框
    handleSelectionChange(val) {
      let ids = [];
      ids = val.map(e =>e.measureId)
      this.ids = ids;
    },

    // 搜索
    search() {
      this.pageNum = 1;
      this.getUnitList();
    },

    // 重置表单
    resetForm(formName) {
      this.$refs[formName].resetFields(this.searchForm = {});
      this.getUnitList();
    },
  },
  created() {
    this.getUnitList();
  },
};
</script>
